React = require('react')
{connect} = require('react-redux')
{View,Text,Image,TextInput,TouchableOpacity} = require('react-native')
# Flex = require('antd-mobile/lib/flex')
Button = require('antd-mobile/lib/button')
List = require('antd-mobile/lib/list')
InputItem = require('antd-mobile/lib/input-item')
Dimensions = require('Dimensions')
{ width, height } = Dimensions.get('window')

Toast = require('antd-mobile/lib/toast')  


{fetchLogin} = require('../actions/userInfo.js')
backImg = require('../img/back.png')



Home = require('./home.js')
Login = React.createClass
  getInitialState : ->
    name:null
    pass:null
    clicked:false
  clickHandle:->
    debugger
    unless @state.name
      Toast.fail '请输入用户名'
      return
    unless @state.pass
      Toast.fail '请输入密码'
      return

    @setState clicked:true
    @props.dispatch fetchLogin
      name:@state.name
      pass:@state.pass
  componentDidUpdate:->
    that = @
    if @state.clicked and  @props.userInfo.pilotCode and @props.userInfo.pilotCode isnt 'guest'
      Toast.success('登陆成功',1)
      setTimeout ->
        that.props.navigator.pop()
      ,1000
  render:->
    # flexDirection:'column',alignItems:'center'
      <View style={{height:height,width:width,backgroundColor:'#ffffff'}}>
        <View style={{flexDirection:'row',height:60,alignItems:'center', justifyContent:'center',backgroundColor:'#0066FF'}}>
          <View style={{flex:1,padding:10}}>
            <TouchableOpacity onPress={=>@props.navigator.pop()}>
              <Image source={backImg}  style={{height:30,width:30,resizeMode:'contain'}}/>
            </TouchableOpacity>
          </View>
          <View style={{flex:1,justifyContent:'center',alignItems:'center'}}>
            <Text style={{fontSize:20,color:'#ffffff'}}>登陆</Text>
          </View>
          <View style={{flex:1,alignItems:'flex-end',padding:10}}>
          </View>
        </View>
        <View>
          <List>
            <InputItem placeholder="请输入" autoCorrect={false} onChange={(text)=>@setState name:text } value={@state.name}>用户名
            </InputItem>
            <InputItem placeholder="请输入" onChange={(text)=>@setState pass:text } value={@state.pass} type="password">密码
            </InputItem>
            <View style={{margin:12}}>
              <Button type='primary' onClick={@clickHandle}>登陆</Button>
            </View>
          </List>
        </View>
      </View>

# <View style={{height:20,marginTop:20}}>
#   <TextInput style={{fontSize:16}} autoCorrect={false} autoFocus={true} placeholder='请输入用户名' onChangeText={(text)=>@setState name:text }></TextInput>
# </View>
# <View style={{height:20,marginTop:20}}>
#   <TextInput secureTextEntry={true} style={{fontSize:16}} password=true placeholder='请输入密码' onChangeText={(text)=>@setState pass:text }></TextInput>
# </View>
# <View style={{height:20}}>
#   <Button type='primary' onClick={@clickHandle}>登陆</Button>
# </View>
mapStateToProps = (state)->
  userInfo:state.userInfo
module.exports = connect(mapStateToProps)(Login)
